var IconListMap = new Object();
var IconList = function(opt){
	
	this.target = opt.target?opt.target:'iconList';
	this.content = opt.content?opt.content:'pIconListBox';
	this.tipBox = opt.tipBox?opt.tipBox:'pIconListTipBox';
	this.disNum = opt.disNum?opt.disNum:2;				//显示行数
	this.disRowNum = opt.disRowNum?opt.disRowNum:5;		//每行显示个数
	this.itemHeight = opt.itemHeight?opt.itemHeight:220;	//分类高度
	this.itemWidth = opt.itemWidth?opt.itemWidth:170;	//分类高度
	this.showTip = opt.showTip?opt.showTip:false;		//显示提示
	this.onfocus = opt.onfocus?opt.onfocus:false;		//焦点在导航上
	this.onblur = opt.onblur?opt.onblur:false;		//焦点在item上
	this.onclick = opt.onclick?opt.onclick:false;		//点击事件
	
	if(opt.formatHtml){
		this.formatHtml = opt.formatHtml;
	}
	
	this.focusClass = opt.focusClass?opt.focusClass:'_iconListCurTd';
	this.normalClass = opt.normalClass?opt.normalClass:'_iconListTd';
	this.emptyClass = opt.emptyClass?opt.emptyClass:'_iconListTd';
	this.trClass = opt.trClass?opt.trClass:'_iconListTr';
	
	this.showSplit = false;
	this.splitHeight = opt.splitHeight?opt.splitHeight:440;
	this.splitBar = opt.splitBar?opt.splitBar:'pIconListSplitBar';
	this.splitAddValue = 0;
	this.splitBarHeight = 0;
	
	this.curItemId = 0;
	this.focusItemId = 0;
	this.topItemId = 0;
	this.rowNum = 0;
	this.dataList = new Array();
	
	if(this.showTip){
		var tipBox = document.getElementById(this.tipBox);
		var tip = tipBox.getElementsByClassName('_iconListTipBoxMid');
		this.tipContent = tip[0];
	}
	
	IconListMap[this.target] = this;
}

IconList.prototype = {
	getData:function(){
		if(this.curItemId > 0){
			return this.dataList[this.curItemId - 1];
		}else{
			return false;
		}
	},
	getFocusData:function(){
		if(this.focusItemId > 0){
			return this.dataList[this.focusItemId - 1];
		}else{
			return false;
		}
	},
	setFocus:function(id){
		var a = false;
		if(id){
			a = document.getElementById(this.target+'-a-'+id);
		}else{
			a = document.getElementById(this.target+'-a-'+this.focusItemId);
		}
		if(a){
			a.focus();
		}
	},
	appendDataList:function(list){
		if(list && list.length > 0){
			for(var i = 0;i<list.length;i++){
				this.dataList.push(list[i]);
			}
			this.format();
			
			var listBox = document.getElementById(this.content);
			var childNodes = listBox.childNodes;
			
			listBox.removeChild(childNodes[0]);		//删除第一个节点
			listBox.removeChild(childNodes[childNodes.length - 1]);		//删除最后一个节点
			
			var curRow = parseInt((this.focusItemId - 1)/this.disRowNum) + 1; 
			var nId = curRow + 1;
			this.appendDiv(nId,listBox);
			this.appendDiv(nId+1,listBox);
			this.topItemId++;
			this.showSplitBox();
			
			if(this.showTip){
				this.showTipBox(this.dataList[this.focusItemId - 1],curRow,this.focusItemId);
			}
		}
	},
	
	isLastRow:function(){
		var curRow = parseInt((this.focusItemId - 1)/this.disRowNum) + 1; 
		return curRow == this.rowNum;
	},
	isFirst:function(){
		return this.focusItemId%this.disRowNum == 1;
	},
	setFirstFocus:function(){
		var curRow = parseInt((this.focusItemId - 1)/this.disRowNum) + 1; 
		var id = (curRow - 1)*this.disRowNum + 1;
		this.setFocus(id);
	},
	isLast:function(){
		if(this.dataList){
			if(this.focusItemId > 0){
				return this.focusItemId%this.disRowNum == 0;
			}
		}
		return false;
	},
	setType:function(type){
		this.dataList = type.dataList;
		this.topItemId = type.topItemId;
		this.focusItemId = type.focusItemId;
		this.curItemId = type.curItemId;
		this.showSplit = type.showSplit;
		this.splitAddValue = type.splitAddValue;
		this.splitBarHeight = type.splitBarHeight;
		this.rowNum = type.rowNum;
		
		this.refreshContent();
	},
	setDataList:function(list,onfocus){
		if(!list) list = new Array();
		this.dataList = list;
		this.format();
		this.curItemId = 1;
		this.topItemId = 0;
		this.focusItemId = 1;
		
		this.refreshContent();
		if(onfocus){
			var a = document.getElementById(this.target+'-a-'+this.focusItemId);
			if(a){
				a.focus();
			}
		}
	},
	formatType:function(type){
		var length = type.dataList.length;
		type.rowNum = parseInt((length -1)/this.disRowNum)+1;
		if(type.rowNum > this.disNum){
			type.showSplit = true; 
			/*
			if(type.rowNum< 2*this.disNum){
				type.splitAddValue = this.itemHeight;
			}else{ 
				type.splitAddValue = (this.splitHeight - this.itemHeight)/(type.rowNum  - this.disNum);
			}
			*/
			
			type.splitAddValue = (this.splitHeight - 50)/(type.rowNum  - this.disNum);
		
			//type.splitBarHeight = this.splitHeight - (type.rowNum  - this.disNum)*type.splitAddValue;
		}else{
			this.showSplit = false;
		}
		type.curItemId = 1;
		type.topItemId = 0;
		type.focusItemId = 1;
	},
	getRowNum:function(id){
		return  parseInt((id -1)/this.disRowNum)+1;
	},
	format:function(){
		var length = this.dataList.length;
		this.rowNum = parseInt((length -1)/this.disRowNum)+1;
		if(this.rowNum > this.disNum){
			this.showSplit = true;
			/*
			if(this.rowNum< 2*this.disNum){
				this.splitAddValue = this.itemHeight;
			}else{
				this.splitAddValue = (this.splitHeight - this.itemHeight)/(this.rowNum  - this.disNum);
			}
			*/
			this.splitAddValue = (this.splitHeight - 50)/(this.rowNum  - this.disNum);
			alert("this.splitAddValue#########################::;"+this.splitAddValue);
			this.splitBarHeight = this.splitHeight- (this.rowNum  - this.disNum)*this.splitAddValue;
		}else{
			this.showSplit = false;
		}
	},
	refreshContent:function(){
		var dataList = this.dataList; 
	
		var listBox = document.getElementById(this.content);
		var con = '';
		if(dataList && dataList.length > 0){
			var start = this.topItemId;
			var end = start + this.disNum + 2;
			
			for(var i = start;i<end;i++){
				con+='<div class="'+this.trClass+'">';
				if(i<1 || i>this.rowNum){
					con+='&nbsp;';
				}else{
					con+=this.formatTrHtml(i);
				}
				con+='</div>';
			}
		}
		listBox.innerHTML = con;
		
		this.showSplitBox();
		
		var aList = listBox.getElementsByTagName('a');
		var a;
		for(var i = 0;i<aList.length;i++){
			a = aList[i];
			a.onfocus = this.focusItem;
			a.onblur = this.blurItem;
			a.onclick = this.clickItem;
		}
	},
	formatTrHtml:function(id){
		var dataList = this.dataList;
		var start = (id-1)*this.disRowNum + 1;
		var end = start + this.disRowNum;
		var con = '';
		for(var i = start;i<end;i++){
			
			if(i<1 || i>dataList.length){
				con+='<div class="'+this.emptyClass+'">';
				con+='&nbsp;';
			}else{
				con+='<div class="'+this.normalClass+'">';
				con+=this.formatHtml(i,id,dataList[i-1]);
			}
			con+='</div>';
		}
		return con;
	},
	formatHtml:function(i,row,data){
		var con = '';
		con += '<div class="_iconListIcon"><a href="#" id="'+this.target+'-a-'+i+'" tar="'+i+'" row="'+row+'"><img src="'+data.img+'"/></a></div>';
		
		return con;
	},
	showSplitBox:function(){
		var splitBar = document.getElementById(this.splitBar);
		var par = splitBar.parentNode;
		if(this.showSplit){
			par.style.display ='block';
			//splitBar.style.height =this.splitBarHeight+'px';
			this.changeSplit();
			return true;
		}else{
			par.style.display ='none';	
			return false;
		}
	},
	changeSplit:function(){
		if (this.showSplit) {
			var topItemId = this.topItemId;
			
			var totalRow = parseInt((this.dataList.length - 1)/this.disRowNum) + 1; 
			var max = totalRow- this.disNum; 
			if(topItemId>max){
				topItemId = max;
			}
			var top = topItemId * this.splitAddValue;
			var splitBar = document.getElementById(this.splitBar);
			splitBar.style.top = top+'px';
		}
	},
	focusItem:function(event){
		var a = event.currentTarget;
		var par = a.parentNode.parentNode;
		var id = a.id;
		var idArray = id.split('-');
		var _this = IconListMap[idArray[0]];
		var tar = parseInt(idArray[2]);
		var row = parseInt(a.getAttribute('row'));
		
		par.className = _this.focusClass; 
		if(_this.showSplit){
			_this.moveItem(row,tar);
		}
		_this.focusItemId = tar;
		
		var data = _this.dataList[tar - 1];
		if(_this.showTip){
			_this.showTipBox(data,row,tar);
		}
		
		if(_this.onfocus){
			
			_this.onfocus(data,tar,_this);
		}
	},
	showTipBox:function(data,row,tar){
		
		var curRow = (tar-1)%this.disRowNum + 1;
		
		var l = (curRow  - 1)*this.itemWidth;
		var t = (row - this.topItemId - 1 - 0.20) * this.itemHeight;
		
		var tipBox = document.getElementById(this.tipBox);
		tipBox.style.display = 'block';
		tipBox.style.left = l;
		tipBox.style.top = t;
		this.tipContent.innerHTML = data.name;
		document.refresh();
	},
	hideTipBox:function(){
		var tipBox = document.getElementById(this.tipBox);
		tipBox.style.display = 'none';
	},
	blurItem:function(event){
		var a = event.currentTarget;
		var par = a.parentNode.parentNode;
		var id = a.id;
		var idArray = id.split('-');
		var _this = IconListMap[idArray[0]];
		var tar = parseInt(idArray[2]);
		
		par.className = _this.normalClass;
		if(_this.showTip){
			_this.hideTipBox();
		}
		if(_this.onblur){
			var data = _this.dataList[tar - 1];
			_this.onblur(data,tar,_this);
		}
	},
	clickItem:function(event){
		var a = event.currentTarget;
		var id = a.id;
		var idArray = id.split('-');
		var _this = IconListMap[idArray[0]];
		var tar = parseInt(idArray[2]);
		_this.curItemId = tar;
		if(_this.onclick){
			var data = _this.dataList[tar - 1];
			_this.onclick(data,tar,_this);
		}
	},
	appendDiv:function(nId,listBox){
		var totalNum = this.rowNum;
		var div = document.createElement('div');
		div.setAttribute('class',this.trClass);
		if(nId>totalNum){
			div.innerHTML = '&nbsp;';
			listBox.appendChild(div);
		}else{
			div.innerHTML=this.formatTrHtml(nId);
			listBox.appendChild(div);
			
			var aList = div.getElementsByTagName('a');
			var a;
			for(var i = 0;i<aList.length;i++){
				a = aList[i];
				a.onfocus = this.focusItem;
				a.onblur = this.blurItem;
				a.onclick = this.clickItem;
			}
		}
	},
	pageUp:function(justForPageA,tip){
		if(!this.showSplit){return ;} 
		if(this.topItemId > 0){
			var a = document.getElementById(justForPageA);
			a.focus();
			
			var prevPage = this.topItemId - this.disNum;
			
			if(prevPage < 0 ){
				prevPage = 0;
			}
			
			this.topItemId = prevPage;
			
			this.refreshContent();
			var na = document.getElementById(this.target+'-a-'+(prevPage*this.disRowNum+1));
			na.focus();
		}else{
			if(tip){
				showGTip(tip,3000);
			}
		}
	},
	pageDown:function(justForPageA,tip){
		if(!this.showSplit){return ;} 
		var nextPage = this.topItemId + this.disNum;
		var totalRow = parseInt((this.dataList.length - 1)/this.disRowNum) + 1; 
		if(nextPage <totalRow){
			var a = document.getElementById(justForPageA);
			a.focus();
			this.topItemId = nextPage;
			this.curItemId = nextPage + 1;
			this.refreshContent();
			
			var na = document.getElementById(this.target+'-a-'+(nextPage*this.disRowNum+1));
			na.focus();
		}else{
			//showGTip(tip,3000);
		}
	},
	moveItem:function(row,tar){
		var curRow = parseInt((this.focusItemId - 1)/this.disRowNum) + 1; 
		if (row == curRow) { this.changeSplit();return ;}
		
		var listBox = document.getElementById(this.content);
		var childNodes = listBox.childNodes;
		
		var totalNum = this.rowNum;
		
		if (row > curRow) { //向下
			if(row ==this.topItemId + this.disNum + 1){		//当焦点不是在最下面的时候
				listBox.removeChild(childNodes[0]);		//删除第一个节点
				var nId = row+1;
				this.appendDiv(nId,listBox);
				this.topItemId++;
				this.changeSplit();
			}
		}else if(row<curRow){		//向上
			if(row == this.topItemId){		//当焦点不是在最上面的时候
				if( childNodes.length  >= this.disNum + 2){
					listBox.removeChild(childNodes[childNodes.length - 1]);		//删除最后一个节点
				}
				var pId = row-1;
				var div = document.createElement('div');
				div.setAttribute('class',this.trClass);
				
				if(pId<1){
					div.innerHTML = '&nbsp;';
					listBox.insertBefore(div,childNodes[0]);
				}else{
					
					div.innerHTML = this.formatTrHtml(pId);
					listBox.insertBefore(div,childNodes[0]);
					
					var aList = div.getElementsByTagName('a');
					var a;
					for(var i = 0;i<aList.length;i++){
						a = aList[i];
						a.onfocus = this.focusItem;
						a.onblur = this.blurItem;
						a.onclick = this.clickItem;
					}
				}
				this.topItemId--;
				this.changeSplit();
			}
		}
	}
}